<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>昭平美食</title>
    <script src="js/tailwindcss.js"></script>
    <script src="js/swiper.js"></script>
    <link href="css/global.css" rel="stylesheet" lang="css">
</head>
<body>

<!--导航部分-->
<header class="h-[64px] w-full bg-white border-b border-gray-300/40 z-50 sticky top-0">
    <div class="max-w-7xl mx-auto w-full flex  items-center justify-between h-full">
        <div class="flex items-center gap-x-6">
            <span class="font-bold text-2xl">There is ZhaoPing</span>
            <nav class="hidden md:block">
                <ul class="list-none flex items-center gap-x-4">
                    <li>
                        <a href="index.html">首页</a>
                    </li>
                    <li class="group  ">
                        <a  class="group-hover:hidden">新闻</a>
                        <ul class="hidden    group-hover:block ">
                            <li><a href="http://www.zpol.cn/xw">本地新闻</a></li>
                            <li><a href="https://www.cctv.com/">国内新闻</a></li>
                            <li><a href="https://news.cctv.cn/world/">国际新闻</a></li>
                        </ul>
                    </li>
                    <li class="group  ">
                        <a  class="group-hover:hidden">风景</a>
                        <ul class="hidden    group-hover:block ">
                            <li><a href="view.html">自然风光</a></li>
                            <li><a href="renwen.html">人文景观</a></li>
                        </ul>
                    </li>
                    <li>
                        <a href="foods.html">风味</a>
                    </li>
                </ul>
            </nav>
        </div>
        <a class="px-6 py-2 bg-blue-500 text-white rounded-full" href="message.html">留言</a>
    </div>
</header>
<!--swiper-->
<div class="w-8/12 m-auto">
    <!--轮播-->
    <swiper>
        <swiper-container pagination="true" autoplay progress="true" parallax="true" pagination="true"
                          pagination-clickable="true" navigation="true" class=" overflow-hidden">
            <swiper-slide>
                <img class="object-cover aspect-[16/9] w-full h-[400px]" src="images/localfood/Carousel1.jpg"
                     alt="swiper-item"/>
            </swiper-slide>
            <swiper-slide>
                <img class="object-cover aspect-[16/9] w-full h-[400px]" src="images/localfood/Carousel2.jpg"
                     alt="swiper-item"/>
            </swiper-slide>
            <swiper-slide>
                <img class="object-cover aspect-[16/9] w-full h-[400px]" src="images/localfood/Carousel3.jpg"
                     alt="swiper-item"/>
            </swiper-slide>
        </swiper-container>
    </swiper>
</div>
<!--banner-->
<section class=" flex flex-col justify-center items-center h-[150px] ">
    <div class="text-3xl ">精选美食推荐</div>
    <div>Best local foods</div>
</section>
<!--本页内容区-->
<section class=" ">
    <div class="max-w-7xl mx-auto ">
        <div class="grid grid-cols-12 gap-4">
            <div class="col-span-12 sm:col-span-6 md:col-span-3  bg-white">
                <img alt="cover" class="w-full h-[250px] object-cover" src="images/localfood/douchifen.jpg" />
                <div class="p-2">
                    <div class="font-bold">黄姚豆豉粉</div>
                    <a href="#part-1" class="mt-1 text-orange-600">详细介绍 →</a>
                </div>
            </div>
            <div class="col-span-12 sm:col-span-6 md:col-span-3 bg-white">
                <img alt="cover" class="w-full  h-[250px] object-cover" src="images/localfood/doufuniang.jpeg" />
                <div class="p-2">
                    <div class="font-bold">昭平豆腐酿</div>
                    <a href="#part-2" class="mt-1 text-orange-600">详细介绍 →</a>
                </div>
            </div>
            <div class="col-span-12 sm:col-span-6 md:col-span-3 bg-white">
                <img alt="cover" class="w-full  h-[250px] object-cover" src="images/localfood/lf.jpeg" />
                <div class="p-2">
                    <div class="font-bold">昭平薄荷凉粉</div>
                    <a href="#part-3" class="mt-1 text-orange-600">详细介绍 →</a>
                </div>
            </div>
            <div class="col-span-12 sm:col-span-6 md:col-span-3 bg-white">
                <img alt="cover" class="w-full  h-[250px] object-cover" src="images/localfood/youcha1.jpg" />
                <div class="p-2">
                    <div class="font-bold">昭平油茶</div>
                    <a href="#part-4" class="mt-1 text-orange-600">详细介绍 →</a>
                </div>
            </div>
        </div>
    </div>
</section>
<!--图文简介-->
<div class="w-8/12 m-auto mt-12">
    <div id="part-4"  class="border-2 mr-0.5 p-12" >
        <div>
            <div class="text-center text-4xl my-2 ">昭平有机油茶</div>
            <div class="text-xl" >油茶，又被称为“擂茶”或“打油茶”，具有独特的口感和营养价值。其制作流程复杂而讲究，需选用上等的茶叶、老姜、大蒜等原料，经过精心研磨和烹煮，才能酿成一杯香气扑鼻、色泽红亮的油茶。喝油茶不仅可以驱寒暖胃，还有清热解毒、提神醒脑等功效。在昭平，油茶已经成为了人们日常生活中不可或缺的一部分。</div>
            <img alt="contentImages" src="images/localfood/youcha1.jpg"  class="mx-auto my-3"/>
            <p class="indent-8 my-2">油茶（Camellia oleifera Abel）是山茶科山茶属小乔木或灌木。油茶幼枝被粗毛；叶革质，椭圆形或倒卵形，先端钝尖，基部楔形，下面中脉被长毛，具细齿，叶柄被粗毛；花顶生，革质，宽卵形，花瓣白色，倒卵形，雄蕊花丝近离生；朔果球形；花期10月至翌年2月，果期翌年9-10月； 因其种子可榨油(茶油)供食用，故名“油茶”。</p>
            <p class="indent-8 my-2">油茶分布在中国广东、香港、广西、湖南及江西。 喜温暖，不耐寒，要有充足的阳光，要求在坡度和缓、侵蚀作用弱的地方栽植，适生在土层深厚、疏松的酸性土壤。 繁殖方式是种子繁殖和嫁接繁殖。</p>
            <p class="indent-8 my-2">油茶可以入药，性平，有小毒，味苦，归脾、胃、大肠经，有清热解毒，活血散瘀，止痛止痒的功效， 是仡佬族吃新节招待客人和供奉祖先的一种食品。 也是优质的食用油，油色清味香，营养丰富。也可作为润滑油、防锈油用于工业。茶饼可以做农药、肥料，有提高农田蓄水能力和防治稻田害虫的功能。油茶果皮是提制栲胶的原料。</p>
        </div>
    </div>

    <div id="part-1"  class="border-2 mr-0.5 p-12" >
        <div>
            <div class="text-center text-4xl my-2 ">黄姚豆豉粉</div>
            <div class="text-xl" >位于贺州市昭平县的黄姚古镇，发祥于宋朝开宝年间，经历明代兴建和清代鼎盛，至抗战后期成
                为广西革命指挥中心和广西民盟的发源地。古镇以典型的岩溶山水景观、神秘的龙文化崇拜、精巧的明清建筑、地道的广府
                民俗风情和光辉灿烂的革命史迹闻名于世，是一座岭南文化与峰丛山水完美融合的千年之镇。</div>
            <img alt="contentImages" src="images/localfood/douchifen.jpg"  class="mx-auto my-3"/>
            <p class="indent-8 my-2">油茶（Camellia oleifera Abel）是山茶科山茶属小乔木或灌木。油茶幼枝被粗毛；叶革质，椭圆形
                或倒卵形，先端钝尖，基部楔形，下面中脉被长毛，具细齿，叶柄被粗毛；花顶生，革质，宽卵形，花瓣白色，倒卵形，雄蕊花丝近离生；朔
                果球形；花期10月至翌年2月，果期翌年9-10月； 因其种子可榨油(茶油)供食用，故名“油茶”。</p>
            <p class="indent-8 my-2">油茶分布在中国广东、香港、广西、湖南及江西。 喜温暖，不耐寒，
                要有充足的阳光，要求在坡度和缓、侵蚀作用弱的地方栽植，适生在土层深厚、疏松的酸性土壤。
                繁殖方式是种子繁殖和嫁接繁殖。</p>
            <p class="indent-8 my-2">油茶可以入药，性平，有小毒，味苦，归脾、胃、大肠经，有清热解毒，
                活血散瘀，止痛止痒的功效， 是仡佬族吃新节招待客人和供奉祖先的一种食品。 也是优质的食用油，
                油色清味香，营养丰富。也可作为润滑油、防锈油用于工业。茶饼可以做农药、肥料，有提高农田蓄水能力和防
                治稻田害虫的功能。油茶果皮是提制栲胶的原料。</p>
        </div>
    </div>

    <div id="part-3"  class="border-2 mr-0.5 p-12" >
        <div>
            <div class="text-center text-4xl my-2 ">昭平薄荷凉粉</div>
            <div class="text-xl" >油茶，又被称为“擂茶”或“打油茶”，具有独特的口感和营养价值。其制作流程复杂而讲究，需选用上等的茶叶、老姜、大蒜等原料，经过精心研磨和烹煮，才能酿成一杯香气扑鼻、色泽红亮的油茶。喝油茶不仅可以驱寒暖胃，还有清热解毒、提神醒脑等功效。在昭平，油茶已经成为了人们日常生活中不可或缺的一部分。</div>
            <img alt="contentImages" src="images/localfood/lf.jpeg"  class="mx-auto my-3"/>
            <p class="indent-8 my-2">油茶（Camellia oleifera Abel）是山茶科山茶属小乔木或灌木。油茶幼枝被粗毛；叶革质，椭圆形或倒卵形，先端钝尖，基部楔形，下面中脉被长毛，具细齿，叶柄被粗毛；花顶生，革质，宽卵形，花瓣白色，倒卵形，雄蕊花丝近离生；朔果球形；花期10月至翌年2月，果期翌年9-10月； 因其种子可榨油(茶油)供食用，故名“油茶”。</p>
            <p class="indent-8 my-2">油茶分布在中国广东、香港、广西、湖南及江西。 喜温暖，不耐寒，要有充足的阳光，要求在坡度和缓、侵蚀作用弱的地方栽植，适生在土层深厚、疏松的酸性土壤。 繁殖方式是种子繁殖和嫁接繁殖。</p>
            <p class="indent-8 my-2">油茶可以入药，性平，有小毒，味苦，归脾、胃、大肠经，有清热解毒，活血散瘀，止痛止痒的功效， 是仡佬族吃新节招待客人和供奉祖先的一种食品。 也是优质的食用油，油色清味香，营养丰富。也可作为润滑油、防锈油用于工业。茶饼可以做农药、肥料，有提高农田蓄水能力和防治稻田害虫的功能。油茶果皮是提制栲胶的原料。</p>
        </div>
    </div>

    <div id="part-2"  class="border-2 mr-0.5 p-12" >
        <div>
            <div class="text-center text-4xl my-2 ">昭平豆腐酿</div>
            <div class="text-xl" >油茶，又被称为“擂茶”或“打油茶”，具有独特的口感和营养价值。其制作流程复杂而讲究，需选用上等的茶叶、老姜、大蒜等原料，经过精心研磨和烹煮，才能酿成一杯香气扑鼻、色泽红亮的油茶。喝油茶不仅可以驱寒暖胃，还有清热解毒、提神醒脑等功效。在昭平，油茶已经成为了人们日常生活中不可或缺的一部分。</div>
            <img alt="contentImages" src="images/localfood/doufuniang.jpeg"  class="mx-auto my-3"/>
            <p class="indent-8 my-2">油茶（Camellia oleifera Abel）是山茶科山茶属小乔木或灌木。油茶幼枝被粗毛；叶革质，椭圆形或倒卵形，先端钝尖，基部楔形，下面中脉被长毛，具细齿，叶柄被粗毛；花顶生，革质，宽卵形，花瓣白色，倒卵形，雄蕊花丝近离生；朔果球形；花期10月至翌年2月，果期翌年9-10月； 因其种子可榨油(茶油)供食用，故名“油茶”。</p>
            <p class="indent-8 my-2">油茶分布在中国广东、香港、广西、湖南及江西。 喜温暖，不耐寒，要有充足的阳光，要求在坡度和缓、侵蚀作用弱的地方栽植，适生在土层深厚、疏松的酸性土壤。 繁殖方式是种子繁殖和嫁接繁殖。</p>
            <p class="indent-8 my-2">油茶可以入药，性平，有小毒，味苦，归脾、胃、大肠经，有清热解毒，活血散瘀，止痛止痒的功效， 是仡佬族吃新节招待客人和供奉祖先的一种食品。 也是优质的食用油，油色清味香，营养丰富。也可作为润滑油、防锈油用于工业。茶饼可以做农药、肥料，有提高农田蓄水能力和防治稻田害虫的功能。油茶果皮是提制栲胶的原料。</p>
        </div>
    </div>
</div>
<!--底部链接导航-->
<section class="max-w-7xl mx-auto my-10">
    <div class="flex justify-start gap-6">
        <div class="font-bold text-2xl text-gray-500 ">友情链接</div>
        <div class="p-2 flex items-center gap-4 flex-wrap">
            <a href="https://www.ylu.edu.cn/index.htm">玉林师范学院</a>
            <a href="http://webui.lw1001.cn/">原演示地址(视频服务器已关闭)</a>
        </div>
    </div>

</section>

<footer class="h-[64px] w-full">
    <div class="flex max-w-7xl mx-auto h-full justify-center gap-x-2 items-center">
        <span>202306062127</span>
        <strong>梁伟明</strong>
        <span>2023上学年WEBUI期末考试</span>
    </div>
</footer>
</body>
</html>
